<div class="module-login">
    <template v-if="isLoading">
        <div class="m-loading-box">
            <loading></loading>
        </div>
    </template>

    <template v-if="isLoading === false">
        <web-box :title="$t('webBoxPCTitle')" :mobileTit="$t('webBoxTitle')">
            <validator :rules="rules" :parent="_self">
                <form class="m-form-page m-form-login" name="form" action="javascript:;">
                    <div class="col-row fn-flex" style="position: relative;">
                        <label class="row-title">账号</label>
                        <input class="p-input" type="text" placeholder="请输入手机号" name="email" v-model="form.email"
                            @blur="blurEmail()" class="input">
                        <div class="ui-tip"></div>
                    </div>
                    <div class="col-row fn-flex">
                        <label class="row-title">{{$t('common.password')}}</label>
                        <input type="password" :placeholder="$t('common.pPass')" v-model="form.password" name="password"
                            autocomplete="off" class="input">
                        <div class="ui-tip"></div>
                    </div>
                    <div class="col-row" v-if="needImgCode === true">
                        <div class="comp-verify-code img-code">
                            <a href="javascript:;" class="img-code-link">
                                <img :src="imgCodeSrc" @click="changeImgCode()" width="144" height="40">
                            </a>
                        </div>
                        <input type="text" :placeholder="$t('common.pCaptcha')" name="code" maxlength="4"
                            autocomplete="off" v-model="form.code" class="input-left">
                        <div class="ui-tip"></div>
                    </div>
                    <div class="col-row isRemember">
                        <input type="checkbox" v-model="isRemember" class="input-left">
                        <span @click="isRemember = !isRemember">{{$t('remember')}}</span>
                    </div>
                    <!--                 <div class="col-row fn-flex m-forget-register">
                    <a href="./reset.html" class="link link-reset">{{$t('forgotPass')}}</a>
                </div> -->
                    <div class="col-row" style="margin-top: 16px;">
                        <button type="submit" @click="submit()" v-if="isRequesting === false"
                            class="ui-btn  submit-btn">{{$t('common.signIn')}}</button>
                        <button type="submit" disabled v-if="isRequesting === true"
                            class="ui-btn  submit-btn">{{$t('common.waiting')}}...</button>
                    </div>
                    <div class="col-row fn-flex forget-register">
                        <a href="./reset.html" class="link link-reset">{{$t('forgotPass')}}</a>
                        <span class="text">|</span>
                        <a href="./register.html" class="link link-register">{{$t('common.signUp')}}</a>
                    </div>
                </form>
            </validator>
        </web-box>
    </template>
</div>